import { Component, OnDestroy, OnInit, ChangeDetectionStrategy, ChangeDetectorRef, SimpleChanges } from '@angular/core';
// tslint:disable-next-line:import-blacklist
import { Subject, Observable } from 'rxjs';

@Component({
    selector: 'app-timer',
    templateUrl: './index.html',
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class TimerComponent implements OnInit, OnDestroy {
    date = 0;

    private _timer: any;
    private _cd: BufferChangeDetectorRef;

    constructor(cd: ChangeDetectorRef) {
        this._cd = new BufferChangeDetectorRef(cd);
    }

    ngOnDestroy(): void {
        clearInterval(this._timer);
    }
    ngOnInit(): void {
        this._timer = setInterval(() => {
            this.date++;
            this._cd.markForCheck();
        }, 10);
    }
    // tslint:disable-next-line:use-life-cycle-interface
    ngDoCheck(): void {
        console.log('ngDocheck-timer');
    }
}


export class BufferChangeDetectorRef {

    private _bufferSubject = new Subject<any>();
    constructor(private _cd: ChangeDetectorRef) {
        this._bufferSubject.asObservable()
            .bufferCount(100)
            .subscribe(v => {
                this._cd.markForCheck();
            });
    }

    public markForCheck(): void {
        this._bufferSubject.next();
    }
}

